<template>
  <el-table-column
      v-bind="item"
      :label="item.label"
      :prop="item.prop"
      :formatter="tableItemFormatter"
  >
    <template v-if="item.children && item.children.length">
      <TableItem
          v-for="(child,index) in item.children"
          :item="child"
          :key="'child' + index"
          :table-vm="tableVm"
          :tableData="tableData"
      ></TableItem>
    </template>
    <template #header="{column, $index}" v-if="hasSlotName('header')">
      <RenderVnodes
          :vnodes="slot('header',{column, $index,tableData})"
      ></RenderVnodes>
    </template>
    <template #default="{row, column, $index }" v-if="item.type === 'radio'">
      <el-radio
        :label="true"
        :model-value="!!tableVm.nowSelect.find(i=>i===row)"
        @click.native.stop="getCurrentRow(row,!!tableVm.nowSelect.find(i=>i===row))"
      >&nbsp;</el-radio>
    </template>
    <template #default="{row, column, $index }" v-else-if="hasSlotName('default')">
      <RenderVnodes
          :vnodes="slot('default',{row, column, $index ,tableData})"
      ></RenderVnodes>
    </template>
    <template v-else-if="item.extendType" #default="{row, column, $index }">
      <component
          :is="'DynamicTable'+item.extendType"
          :item="item"
          :tableData="tableData"
          :tableVm="tableVm"
          :defaultProps="{row, column, $index }"
          ref="component"
      ></component>
    </template>
  </el-table-column>
</template>

<script lang="ts">
import {defineComponent} from 'vue'
import {FormatterFirstParam} from "./types";
import {getComponents} from "./componentsConfig";
import {BaseCommonMixin} from "./mixins/BaseCommonMixin";

export default defineComponent({
  name: 'TableItem',
  components: getComponents(),
  mixins:[BaseCommonMixin],
  computed:{
    formatterFirstParam(): FormatterFirstParam {
      return {
        tableData: this.data
      }
    },
    tableItemFormatter() {
      if(this.item.formatter){
        return (...args)=>{
          return this.item.formatter(this.formatterFirstParam,...args)
        }
      } else {
        return undefined
      }
    }
  },
  methods: {
    async getCurrentRow(row,isSelect){
      this.tableVm.clearSelection()
      await this.$nextTick()
      this.tableVm.$emit('selectChangeEvent',this.tableVm.plusEventsFirstParam,this.tableVm.nowSelect)
      await this.$nextTick()
      this.tableVm.toggleRowSelection(row,!isSelect)
      await this.$nextTick()
      this.tableVm.$emit('selectChangeEvent',this.tableVm.plusEventsFirstParam,this.tableVm.nowSelect)
    }
  }
})
</script>

<style lang="scss" scoped>

</style>
